<template>
  <div
    style="
      width: 720px;
      display: flex;
      margin: 0 auto;
      justify-content: center;
    "
  >
    <Logo />
    <div>Welcome To Admin Dapianzi</div>
    <a-form style="width: 640px;" @keyup.enter="login">
      <a-form-item label="Username">
        <a-input v-model="loginForm.username" />
      </a-form-item>
      <a-form-item label="Password">
        <a-input v-model="loginForm.password" />
      </a-form-item>
      <a-form-item v-if="sensitive" label="Captcha">
        <a-input v-model="loginForm.captcha" />
      </a-form-item>
      <a-form-item>
        <a-button @click="login">LOGIN</a-button>
      </a-form-item>
    </a-form>
  </div>
</template>
<script>
export default {
  layout: '',
  fetch() {},
  async asyncData() {},
  data: () => {
    return {
      loginForm: {
        username: '',
        password: '',
        captcha: '',
      },
      sensitive: false,
    }
  },
  computed: {},
  mounted() {},
  methods: {
    login() {
      this.$store
        .dispatch('admin/user_login', this.loginForm)
        .then((res) => {
          this.$storage.set('admin-user', res, 7 * 3600 * 24)
          this.$log('login success')
          this.$nuxt.context.redirect('/admin/dashboard')
        })
        .catch((e) => {
          console.error(e)
        })
    },
  },
}
</script>
